.HomeTitle {
	width: 100%;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	font-size: 24px;
	font-family: YouSheBiaoTiHei;
	color: #ffffff;

	&::after,
	&::before {
		position: absolute;
		content: "";
		top: 0;
		width: 2px;
		height: 32px;
		background: white;
	}

	&::after {
		left: 0;
	}

	&::before {
		right: 0;
	}
}

.HomeBox {
	.divElement {
		width: 150px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		& > div:first-child {
			width: 150px;
			height: 32px;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 50px;
			background: linear-gradient(
				0,
				rgba(185, 30, 0, 0.85),
				rgba(255, 190, 98, 0.85)
			);
			font-size: 12px;
			font-family: MicrosoftYaHei;
			font-weight: bold;
			color: #ffffff;
			border: 2px solid #ffed8e;
			margin-bottom: 16px;
		}

		& > div:last-child {
			font-size: 18px;
			font-family: YouSheBiaoTiHei;
			color: #ffffff;
			text-shadow: 0 0 16px rgba(185, 30, 0, 0.8);
		}
	}

	.Left {
		margin-left: 72px;
		margin-top: 264px;
		width: 320px;
		height: 100%;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;

		pointer-events: auto;

		& > div {
			width: 100%;

			&:nth-child(1) {
				margin-bottom: 8px;
				pointer-events: auto;

				& > div:last-child {
					cursor: pointer;
				}

				& > div:first-child {
					margin-bottom: 16px;
				}

				& > div:last-child {
					display: flex;
					align-items: center;
					justify-content: center;
					flex-wrap: wrap;

					& > div {
						width: 50%;
						margin-bottom: 16px;
						display: flex;
						align-items: center;
						justify-content: center;
						flex-direction: column;

						& > img {
							width: 48px;
							height: 48px;
							display: block;
							margin-bottom: 8px;
						}

						& > div {
							font-size: 20px;
							font-family: YouSheBiaoTiHei;
							color: #ffffff;
						}
					}
				}
			}

			&:nth-child(2) {
				display: flex;
				align-items: center;
				justify-content: space-between;
				flex-wrap: wrap;
				margin-bottom: 16px;

				& > div {
					width: 45%;
					height: 53px;
					border-radius: 50px;
					margin-bottom: 8px;
					background: linear-gradient(
						125deg,
						rgba(35, 102, 149, 1),
						rgba(35, 102, 149, 0.1)
					);
					display: flex;
					align-items: center;
					justify-content: flex-start;
					cursor: pointer;

					& > span {
						color: rgba(27, 156, 177, 1);
						font-size: 30px;
						margin: 0 8px;
					}

					& > div {
						& > div:first-child {
							font-size: 14px;
							font-family: MicrosoftYaHei;
							font-weight: bold;
							color: #ffffff;
						}

						& > div:last-child {
							font-size: 14px;
							font-family: MicrosoftYaHei;
							font-weight: bold;
							color: #5cd3ff;
						}
					}
				}
			}

			&:nth-child(3) {
				margin-bottom: 32px;

				& > div {
					height: 40px;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-bottom: 8px;
					cursor: pointer;

					& > div:nth-child(1) {
						width: 4px;
						height: 100%;
					}

					& > div:nth-child(2) {
						padding-left: 24px;
						flex: 1;
						font-size: 14px;
						font-family: MicrosoftYaHei;
						font-weight: bold;
						color: #ffffff;
					}

					& > div:nth-child(3) {
						padding-right: 16px;
						text-align: right;
						font-size: 12px;
						font-family: MicrosoftYaHei;
						font-weight: bold;
						color: #ffffff;
					}
				}
			}
		}
	}

	.Right {
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;
		flex-direction: column;
		padding-right: 72px;
		height: 100%;
		overflow: hidden;
		pointer-events: none;

		& > img {
			margin-top: 130px;
			width: 350px;
			height: 350px;
			display: block;
			cursor: pointer;
			pointer-events: auto;
		}

		& > .RightMenu {
			flex: 1;
			width: 350px;
			overflow-y: scroll;
			margin-bottom: 16px;
			pointer-events: auto;

			& > .MenuItem {
				width: 100%;
				margin-bottom: 4px;

				& > .MenuOne {
					height: 32px;
					background: rgba(19, 89, 111, 0.4);
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 0 16px;
					position: relative;
					z-index: 1;
					border-left: 1px solid white;
					font-size: 20px;
					font-family: YouSheBiaoTiHei;
					color: #ffffff;
					cursor: pointer;
				}

				& > .MenuTwo {
					overflow: hidden;

					& > div {
						height: 32px;
						font-size: 14px;
						display: flex;
						align-items: center;
						justify-content: center;
						font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
						font-weight: bold;
						color: #ffffff;
						line-height: 32px;
						cursor: pointer;
						margin: 4px 8px;

						&.active {
							background: linear-gradient(
								180deg,
								rgba(185, 30, 0, 1),
								rgba(255, 190, 98, 1)
							);
							border: 3px solid #ffed8d;
						}
					}
				}
			}
		}

		& > .Button {
			width: 350px;
			height: 52px;
			margin-bottom: 130px;

			& > div {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				height: 100%;
				background: #21afd5 linear-gradient(0, #00403a, #37eeff);
				border-radius: 25px 25px 25px 25px;
				border: 2px solid #a3fff3;
				font-size: 24px;
				font-family: YouSheBiaoTiHei;
				color: #ffffff;
				text-shadow: 0 0 8px #262626;
				cursor: pointer;
				pointer-events: auto;
			}
		}
	}
}

.Other {
	.divElement {
		width: 270px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		& > div {
			width: 270px;
			height: 34px;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 50px;
			background: linear-gradient(
				0,
				rgba(185, 30, 0, 0.85),
				rgba(255, 190, 98, 0.85)
			);
			font-size: 18px;
			font-family: MicrosoftYaHei;
			font-weight: bold;
			color: #ffffff;
			border: 2px solid #ffed8e;
			margin-bottom: 4px;
		}

		& > img {
			width: 28px;
			height: 31px;
		}
	}

	.Left {
		padding-top: 180px;
		padding-left: 72px;
		padding-bottom: 102px;
		width: 400px;
		height: 100%;

		& > div:first-child {
			margin-bottom: 64px;
		}

		& > div:last-child {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;

			& > div {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				height: 32px;
				font-size: 14px;
				font-family: MicrosoftYaHei;
				font-weight: bold;
				color: #ffffff;
				cursor: pointer;
				pointer-events: auto;

				&.active,
				&:hover {
					border: 3px solid #ffed8d;
					background: linear-gradient(0, #b91e00, #ffbe62);
				}
			}
		}
	}

	.Right {
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;
		flex-direction: column;
		padding-right: 72px;
		margin-top: 130px;

		& > img {
			width: 350px;
			height: 350px;
			display: block;
		}

		& > div {
			width: 325px;

			&:nth-child(2) {
				position: relative;
				font-size: 30px;
				font-family: YouSheBiaoTiHei;
				color: #ffffff;
				text-shadow: 0 0 8px rgba(51, 114, 255, 0.2);
				padding: 0 16px;
				text-align: center;
				margin-bottom: 40px;

				&::after,
				&::before {
					position: absolute;
					content: "";
					top: 0;
					width: 2px;
					height: 100%;
					background: white;
				}

				&::after {
					left: 0;
				}

				&::before {
					right: 0;
				}
			}

			&:nth-child(3) {
				margin-bottom: 32px;

				& > div {
					height: 40px;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-bottom: 16px;

					& > div:nth-child(1) {
						width: 4px;
						height: 100%;
					}

					& > div:nth-child(2) {
						padding-left: 24px;
						flex: 1;
						font-size: 14px;
						font-family: MicrosoftYaHei;
						font-weight: bold;
						color: #ffffff;
					}

					& > div:nth-child(3) {
						padding-right: 16px;
						text-align: right;
						font-size: 12px;
						font-family: MicrosoftYaHei;
						font-weight: bold;
						color: #ffffff;
					}
				}
			}

			&:nth-child(4) {
				& > div {
					display: flex;
					align-items: center;
					justify-content: center;
					height: 52px;
					background: #21afd5 linear-gradient(0, #00403a, #37eeff);
					border-radius: 25px 25px 25px 25px;
					border: 2px solid #a3fff3;
					font-size: 24px;
					font-family: YouSheBiaoTiHei;
					color: #ffffff;
					text-shadow: 0 0 8px #262626;
					cursor: pointer;
					pointer-events: auto;
				}
			}
		}
	}
}
